<!--公司内部监督检查表 superviseInspectRpt-->
<template>
  <Layout>
    <Form ref="queryForm" :model="dataToQuery" :label-width="120">
      <Row class="query-form">
        <Col span="8">
          <FormItem label="二级集团：" prop="twoLevelOrgId">
            <two-level-org org-code v-model="dataToQuery.twoLevelOrgId" ></two-level-org>
          </FormItem>
        </Col>
        <Col span="8">
          <FormItem label="被检查企业：" prop="order">
            <!--                        <cascader-dom class="query-form-el" ref='queryOrgCascader' @setOrgInfo='setQueryCompanyName' :orgTree="true" :setCurrentName="{label:dataToQuery.companyName,value:dataToQuery.companyId}"></cascader-dom>-->
            <company-select v-model="dataToQuery.orgName"></company-select>
            <!--            <selectOrg  v-model="dataToQuery.companyId"></selectOrg>-->
          </FormItem>
        </Col>
        <Col span="8" v-if="!switchFlag">
          <Button @click="switchQuery(true)" class="ivu-btn-switch" type="text">展开∨</Button>
          <Button @click="reset" class="ivu-btn-reset">重置</Button>
          <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
        </Col>
        <Col span="8" v-else>
          <!--<FormItem label="填表时间：" prop="content">-->
          <!--<DatePicker class="query-form-el" v-model="dataToQuery.createRange" format="yyyy-MM-dd" type="daterange"-->
          <!--placement="bottom-end" placeholder="请选择登记时间段" style="width: 100%;"-->
          <!--@on-change="(date) => onSelectFieldQueryDateRange(date, 'createDate')"></DatePicker>-->
          <!--</FormItem>-->
          <FormItem label="检查主题：" prop="checkTheme">
            <Input class='' type='text' v-model='dataToQuery.checkTheme' style="width: 100%;"></Input>
          </FormItem>
        </Col>
      </Row>
      <Row v-show="switchFlag" class="query-form">
        <Col span="8" >
          <FormItem label="检查时间：" prop="content">
            <DatePicker class="query-form-el" v-model="dataToQuery.inspectionTimeRange" format="yyyy-MM-dd"
                        type="daterange" placement="bottom-end" placeholder="请选择检查时间段" style="width: 100%;"
                        @on-change="(date) => onSelectFieldQueryDateRange(date, 'inspectionTime')"></DatePicker>
          </FormItem>
        </Col>
        <Col span="8">
          <FormItem label="整改状态：" prop="state">
            <Select v-model="dataToQuery.state" style="width: 100%;">
              <Option value="1">未闭环企业</Option>
              <Option value="2">闭环企业</Option>
            </Select>
          </FormItem>
        </Col>
        <Col span="8">
          <Button @click="switchQuery(false)" class="ivu-btn-switch" type="text">收起∧</Button>
          <Button @click="reset" class="ivu-btn-reset">重置</Button>
          <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
        </Col>
      </Row>
      <Row class="query-form">
        <Col span="24">
          <Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button>
          <Button type="primary" class="ivu-btn-add" icon="md-cloud-download" :loading="exportLoading" @click="exportFormSubmit">导出</Button>
        </Col>
      </Row>
    </Form>
    <Table ref='table' :height="tableHeight" no-data-text="没有查询到相关数据!" @on-selection-change='getSelectRows'
           :loading='pageStatus.loading' @on-sort-change="sortChange" show-summary :summary-method="handleSummary"
           border :columns="columns1" :data="dataTable">
    </Table>
    <Row style="margin-right:10px;">
      <Col span="24">
        <Page style="float: right" :total="pagedata.total" :page-size="pagedata.pageSize" @on-change="pageChange"
              @on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray" show-total show-sizer
              show-elevator/>
      </Col>
    </Row>
    <Modal :title="mode === 'view'?'公司内部监督检查表详情':'公司内部监督检查表'" :transfer=false :mask-closable="false"
           v-model="dialogShow" v-if="dataToView && dialogShow" :width=900 :styles="{height:'748px'}"
           class-name='limit-height-dialog'>
      <Row>
        <Col span="24">
          <Form ref="dialogForm" :class="mode === 'view'?'modal-view-detail':'rpt-form'" :show-message="false"
                :model="dataToView" :rules="mode === 'view'?{}:ruleCustom" :label-width="mode === 'view'?170:null"
                :label-position="mode === 'view'?'right':'top'">
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="11">
                <FormItem label='被检查企业：' prop='companyId'>
                  <div v-if="mode === 'view'">{{ dataToView.companyName }}</div>
                  <!--                  <Input v-else class='' type='text' v-model='dataToView.companyName'></Input>-->
                  <!--                  <selectOrg v-else v-model="dataToView.companyId" :back-label="dataToView.companyName"></selectOrg>-->
                  <cascader-dom v-else ref='orgCascader' @setOrgInfo='setCompanyId' @setOrgname="setCompanyName"
                                :orgTree="true" :currentOrgId="dataToView.companyId"
                                :setCurrentName="{label:dataToView.companyName,value:dataToView.companyId}"></cascader-dom>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='检查主题：' prop='checkTheme'>
                  <div v-if="mode === 'view'">{{ dataToView.checkTheme }}</div>
                  <Input v-else class='' type='text' v-model='dataToView.checkTheme'></Input>
                </FormItem>
              </Col>
            </Row>

            <Row type="flex" justify="space-around" class="code-row-bg">
              <!-- <Col span="11">
                   <FormItem label='检查组别：' prop='inspectionGroupCategory'>
                       <div v-if="mode === 'view'">{{this.igcMap[dataToView.inspectionGroupCategory] && this.igcMap[dataToView.inspectionGroupCategory].codingName}}</div>
                       <Select v-else class='' placeholder="请选择检查组别" type='text' v-model='dataToView.inspectionGroupCategory' >
                           <Option v-for="item in igcMap" :value="item.codingCodeId" :key="item.codingCodeId">{{ item.codingName }}</Option>
                       </Select>
                   </FormItem>
               </Col>-->
              <Col span="11">
                <FormItem label='检查组人员：' prop='rummager'>
                  <div v-if="mode === 'view'">{{ dataToView.rummager }}</div>
                  <Input v-else class='' type='text' v-model='dataToView.rummager'></Input>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='检查时间：' prop='inspectionTime'>
                  <div v-if="mode === 'view'">{{ renderViewDate(dataToView.inspectionTime) }}</div>
                  <DatePicker v-else type="date" placeholder="请选择日期" style="width: 100%"
                              v-model='dataToView.inspectionTime' :clearable="false"
                              :options="{disabledDate(date) {return date && date.valueOf() > new Date();}}"></DatePicker>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <!-- <Col span="11">
                   <FormItem label='检查内容及发现问题：' prop='contentIssue'>
                       <div v-if="mode === 'view'">{{dataToView.contentIssue}}</div>
                       <Input v-else class='' type='text' v-model='dataToView.contentIssue'></Input>
                   </FormItem>
               </Col>-->
              <Col span="11">
                <FormItem label='发现问题数量：' prop='contentIssueCount'>
                  <div v-if="mode === 'view'">{{ dataToView.contentIssueCount }}</div>
                  <InputNumber v-else class='w' :min="0" placeholder="请填写发现问题数量"
                               :readonly="this.currentUser.loginId != 'superadmin'"
                               type='text' v-model='dataToView.contentIssueCount'></InputNumber>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='整改完成问题数量：' prop='issueCompletionCount'>
                  <div v-if="mode === 'view'">{{ dataToView.issueCompletionCount }}</div>
                  <InputNumber v-else class='w' :min="0" placeholder="请填写整改完成问题数量"
                               :readonly="this.currentUser.loginId != 'superadmin'" type='text'
                               v-model='dataToView.issueCompletionCount'></InputNumber>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label='检查位置：' prop='checkLocation'>
                  <div v-if="mode === 'view'">{{ dataToView.checkLocation }}</div>
                  <Input v-else class='' type='text' v-model='dataToView.checkLocation'></Input>
                </FormItem>
              </Col>
            </Row>

            <Row>
              <Col span="23" class="query-form" style="margin-left: 15px">
                <Button v-if="mode !== 'view'" class="ivu-btn-add" icon="md-add" @click="addItem">新增检查内容及发现问题</Button>
                <Upload v-if="mode !== 'view'" class="importDanger" :action="uploadItemUrl" :show-upload-list="false"
                        :on-success="uploadItem"
                        accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
                        :format="['xlsx','xls']"
                        :headers='{"Authorization": token}'>
                  <Button class="ivu-btn-add" type="ghost" icon="md-cloud-upload">导入</Button>
                </Upload>
                <Button v-if="mode !== 'view'" class="ivu-btn-add" icon="md-cloud-download" @click="downloadMod">
                  导入模版下载
                </Button>
                <FormItem v-else label="检查内容及发现问题：" prop="items"></FormItem>
                <Table highlight-row stripe border style="margin-top:10px;margin-bottom: 10px" :max-height="350"
                       :columns="itemColumn" :data="dataToView.items">
                </Table>
              </Col>
            </Row>

            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem v-if="mode === 'view'" label="检查表：">
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field!=='2'&&t.field!=='3').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field!=='2'&&t.field!=='3')">
                    <a @click="downloadFile(item)"><span style="color: #3399ff;margin-left: 5px">{{
                        item.fileName
                      }}</span></a>
                  </div>
                </FormItem>
                <FormItem v-else label="检查表：">
                  <div>
                    <Upload ref="upload"
                            :before-upload="(file) => { beforeUpload(file, 'fileId') }"
                            :show-upload-list="true"
                            multiple
                            type="drag"
                            :action="fileUrl">
                      <div style="padding: 20px">
                        <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                        <p>点击将文件拖拽到这里上传</p>
                      </div>
                    </Upload>
                  </div>
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field!=='2'&&t.field!=='3').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field!=='2'&&t.field!=='3')">
                    <a @click.prevent="downloadFile(item)">{{ item.fileName }}</a>
                    <Button type="text" icon="md-trash" @click="removeFile(item.id, 'fileId')"
                            style="margin-left: 20px;margin-bottom: 3px"/>
                  </div>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem v-if="mode === 'view'" label="问题清单：">
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field==='2').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field==='2')">
                    <a @click="downloadFile(item)"><span style="color: #3399ff;margin-left: 5px">{{
                        item.fileName
                      }}</span></a>
                  </div>
                </FormItem>
                <FormItem v-else label="问题清单：">
                  <div>
                    <Upload ref="upload"
                            :before-upload="(file) => { beforeUpload1(file, 'fileId','guideFile/2') }"
                            :show-upload-list="true"
                            :max-size="10240"
                            multiple
                            type="drag"
                            :action="fileUrl">
                      <div style="padding: 20px">
                        <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                        <p>点击将文件拖拽到这里上传</p>
                      </div>
                    </Upload>
                  </div>
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field==='2').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field==='2')">
                    <a @click.prevent="downloadFile(item)">{{ item.fileName }}</a>
                    <Button type="text" icon="md-trash" @click="removeFile1(item.id, 'fileId','guideFile/2')"
                            style="margin-left: 20px;margin-bottom: 3px"/>
                  </div>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem v-if="mode === 'view'" label="现场照片：">
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field==='3').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field==='3')">
                    <a @click="downloadFile(item)"><span style="color: #3399ff;margin-left: 5px">{{
                        item.fileName
                      }}</span></a>
                  </div>
                </FormItem>
                <FormItem v-else label="现场照片：">
                  <div>
                    <Upload ref="upload"
                            :before-upload="(file) => { beforeUpload1(file, 'fileId','guideFile/3') }"
                            :show-upload-list="true"
                            multiple
                            type="drag"
                            :action="fileUrl">
                      <div style="padding: 20px">
                        <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                        <p>点击将文件拖拽到这里上传</p>
                      </div>
                    </Upload>
                  </div>
                  <div v-show="dataToView.fileIdFiles.filter(t=>t.field==='3').length>0"
                       v-for="item in dataToView.fileIdFiles.filter(t=>t.field==='3')">
                    <a @click.prevent="downloadFile(item)">{{ item.fileName }}</a>
                    <Button type="text" icon="md-trash" @click="removeFile1(item.id, 'fileId','guideFile/3')"
                            style="margin-left: 20px;margin-bottom: 3px"/>
                  </div>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="11">
                <FormItem label='填表人：' prop='registrant'>
                  <div v-if="mode === 'view'">{{ dataToView.createUserName }}</div>
                  <Input v-else type='text' v-model='dataToView.createUserName' readonly></Input>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='填表时间：' prop='registTime'>
                  <div v-if="mode === 'view'">{{ renderViewDate(dataToView.createDate) }}</div>
                  <DatePicker v-else type="date" placeholder="请选择日期" class="w" v-model='dataToView.createDate'
                              readonly></DatePicker>
                </FormItem>
              </Col>
            </Row>
          </Form>
        </Col>
      </Row>
      <div slot="footer">
        <Button v-if="mode != 'view'" type="primary" class='ivu-btn-save' @click="submit('dialogForm')">确定</Button>
        <Button v-if="mode != 'view'" type="primary" class='ivu-btn-cancel' @click="handleCancel">取消</Button>
        <Button v-if="mode === 'view'" class='ivu-btn-save' @click="dialogShow=false">关闭</Button>
      </div>
    </Modal>
    <Modal :mask-closable="false" :transfer=false v-model="itemModel" :styles="{height:'500px'}"
           :width=600 title="检查内容及发现问题" @on-cancel="itemModel=false, item={}" class-name='limit-height-dialog'>
      <Row>
        <Col span="24">
          <Form ref="itemForm" :class="'modal-form'" :show-message="false" :model="item"
                :rules="itemRuleCustom" label-position="top">
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="11">
                <FormItem label='问题类别：' prop='problemCategory'>
                  <Select v-model="item.problemCategory" label-in-value @on-change="selectChange"
                          v-if="this.$route.query.id == '1'">
                    <Option v-for="item in environmentProtectionList" :value="item.codingCodeId"
                            :key="item.codingCodeId">{{ item.codingName }}
                    </Option>
                  </Select>
                  <Select v-model="item.problemCategory" label-in-value @on-change="selectChange"
                          v-if="this.$route.query.id == '2'">
                    <OptionGroup label="基础管理">
                      <Option v-for="item in sceneList" :value="item.codingCodeId" :key="item.codingCodeId">
                        {{ item.codingName }}
                      </Option>
                    </OptionGroup>
                    <OptionGroup label="现场管理">
                      <Option v-for="item in basicList" :value="item.codingCodeId"
                              :key="item.codingCodeId">{{ item.codingName }}
                      </Option>
                    </OptionGroup>
                  </Select>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='检查时间：' prop='checkTime'>
                  <DatePicker class="w" placeholder="检查时间" v-model='item.checkTime' :clearable="false"></DatePicker>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">

              <Col span="11">
                <FormItem label='完成时限：' prop='issueCompletionTime'>
                  <DatePicker class="w" placeholder="完成时限" v-model='item.issueCompletionTime' :clearable="false"
                              :disabled="item.exist == '1'"></DatePicker>
                </FormItem>
              </Col>
              <Col span="11">
                <FormItem label='整改状态：' prop='state'>
                  <Select v-model="item.state" :disabled="item.procinstState == '1' || item.procinstState == '2'"
                          @on-change="onState">
                    <Option value="NOT_RECTIFIED">待整改</Option>
                    <Option value="START">整改中</Option>
                    <Option value="OPEN">已完成</Option>
                    <Option value="DELAY" disabled>延期</Option>
                  </Select>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label='检查内容：' prop='checkContent'>
                  <Input type="textarea" :autosize="{minRows:2,maxRows:5}" v-model="item.checkContent"/>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label='问题描述：' prop='contentIssue'>
                  <Input type="textarea" show-word-limit :maxlength="1000" :autosize="{minRows:2,maxRows:5}"
                         v-model="item.contentIssue"/>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label='整改方案：'>
                  <Input type="textarea" @input="inputRectifyPlan" show-word-limit :maxlength="1000"
                         :autosize="{minRows:2,maxRows:5}"
                         v-model="item.issueRectificationRequest"/>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label='当前进展描述：' prop='issueCompletion'>
                  <Input type="textarea" show-word-limit :maxlength="1000" :autosize="{minRows:2,maxRows:5}"
                         v-model="item.issueCompletion"/>
                </FormItem>
              </Col>
            </Row>
            <Row type="flex" justify="space-around" class="code-row-bg">
              <Col span="23">
                <FormItem label="整改附件：">
                  <div>
                    <Upload ref="uploadItem"
                            :before-upload="(file) => { beforeUploadItem(file, 'id','EnQuestionDetailForApproval') }"
                            :show-upload-list="true"
                            multiple
                            type="drag"
                            :action="fileUrl">
                      <div style="padding: 10px">
                        <Icon type="ios-cloud-upload" size="45" style="color: #3399ff"></Icon>
                        <p>点击将文件拖拽到这里上传</p>
                        <span style="font-size:8px;color: #797a64">支持扩展名：.rar .zip .doc .docx .pdf...</span>
                      </div>
                    </Upload>
                  </div>
                  <div v-for="(item,index) in item.idFiles" :key='index'>
                    <a @click="downloadFiles(item,index)">{{ item.fileName }}</a>
                    <Button type="text" icon="md-trash"
                            @click="removeItemFile(item.id, 'id','EnQuestionDetailForApproval')"
                            style="margin-left: 5px;margin-bottom: 3px"/>
                    <Progress v-show="uploadListVisible[index]" :percent="uploadListPercent[index]"></Progress>
                  </div>
                </FormItem>
              </Col>
            </Row>

          </Form>
        </Col>

      </Row>
      <div slot="footer">
        <Button type="primary" class='ivu-btn-save' @click="itemSubmit('itemForm')">确定</Button>
        <Button type="primary" class='ivu-btn-cancel' @click="itemModel=false,item={}">取消</Button>
      </div>
    </Modal>
    <Modal title="检查内容及发现问题详情" :transfer=false v-model="modal3" class="modal-view-detail" :width=700
           :styles="{top: '10px'}">
      <Form ref="viewForm" :label-width="100">
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="11">
            <FormItem label="问题类别：">
              <div>
                {{ item.problemCategoryName }}
              </div>
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="检查时间：">
              {{ renderViewDate(item.checkTime) }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="11">
            <FormItem label="完成时限：">
              {{ renderViewDate(item.issueCompletionTime) }}
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="整改状态：">
              {{ renderState(item.state) }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label="问题描述：">
              {{ item.contentIssue }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label="检查内容：">
              {{ item.checkContent }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label='整改方案：' prop='rectifyPlan'>
              {{ item.issueRectificationRequest }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label='当前进展描述：' prop='completion'>
              {{ item.issueCompletion }}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label="整改附件：">
              <div v-for="(item,index) in item.idFiles">
                <a @click="downloadFiles(item,index)"><span style="color: #3399ff;margin-left: 5px">{{
                    item.fileName
                  }}</span></a>
                <Progress v-show="uploadListVisible[index]" :percent="uploadListPercent[index]"></Progress>
              </div>
            </FormItem>
          </Col>
        </Row>
      </Form>
      <div slot="footer">
        <Button class='ivu-btn-save' @click="modal3=false">关闭</Button>
      </div>
    </Modal>
    <Modal title="问题延期" :transfer=false v-model="modal4" :width=700 class-name='limit-height-dialog'
           :styles="{height:'400px',top: '100px'}">
      <Form ref="extensionForm" :model="dataToExtension" :rules="extensionShow" class="rpt-form"
            :show-message="false" label-position="top">
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="11">
            <FormItem label="延期时间：" prop="completeTime">
              <DatePicker type="date" placeholder="请选择日期" style="width: 100%"
                          v-model='dataToExtension.completeTime'
                          :editable='false'></DatePicker>
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="审批人：" prop="userId">
              <Select v-model="dataToExtension.userId">
                <Option v-for="item in approvers" :value="item.userId"
                        :key="item.userId">{{ item.userName }}
                </Option>
              </Select>
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label='延期说明：' prop='explain'>
              <Input class='' type='textarea' v-model='dataToExtension.explain'></Input>
            </FormItem>
          </Col>
        </Row>

      </Form>
      <div slot="footer">
        <Button type="primary" class='ivu-btn-save' :loading="loadingExtension"
                @click="submitExtension('extensionForm')">确定
        </Button>
        <Button type="primary" class='ivu-btn-cancel' @click="cancel">取消</Button>
      </div>
    </Modal>
    <Modal :transfer=false footer-hide v-model="modal5" :width=900>
      <userManager :model="true" :companyId="-1" @getSelectModelData="getSelectModelData">
      </userManager>
    </Modal>
    <Modal title="导入出错" :transfer=false v-model="modelFail" class="modal-view-detail" :width=800
           :styles="{top: '10px'}">
      <Form ref="modelFail" :label-width="100">
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <Table ref='tableFail' :height="400" no-data-text="没有查询到相关数据!"
                   border :columns="columnsFail" :data="dataTableFail">
            </Table>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg" style="margin-top: 10px">
          <Col span="23" style="color: red">
            <div>导入须知:</div>
            <div>1、请使用系统提供的模版导入</div>
            <div>2、如出现时间有误,请统一调整 =》例：2022/01/01</div>
            <div>3、问题类别请使用模版下拉框中提供的</div>
          </Col>
        </Row>
      </Form>
      <div slot="footer">
        <Button class='ivu-btn-save' @click="modelFail=false">关闭</Button>
      </div>
    </Modal>
  </Layout>
</template>

<script>
import {Api} from '@/api/index.js'

import pageCommonFunction from '@/components/pageCommonFunction.js'
import _deepclone from 'lodash/cloneDeep'
import userManager from '../../../base/authorityManager/userManager'
import {sessionStorage} from "@/common/cacheUtils";

var cascaderDom = () => import('@/components/cascader-dom.vue');

export default {
  components: {
    cascaderDom, userManager
  },
  data() {
    return {
      ...this.createCommonDataField(),
      modelFail: false,
      loadingItems: false,
      companyId: sessionStorage('userId').getObject('userId').companyId,
      token: sessionStorage('token').get('Authorization'),
      environmentProtectionList: [],
      modal3: false,
      modal5: false,
      sceneList: [],
      loadingExtension: false,
      basicList: [],
      columnsFail: [
        {
          title: 'excel行号', width: 80, fixed: 'left', align: 'center', key: 'rowNum'
        },
        {
          key: 'errorMsg', title: '错误提示', fixed: 'left', align: 'center', minWidth: 200, tooltip: true,
          render: (h, params) => {
            return h('div', [
              h('A', {
                props: {type: 'primary', size: 'small'},
                style: {color: 'red'},
              }, params.row.errorMsg),
            ]);
          }
        },
        {key: 'checkContent', title: '检查内容', align: 'center', width: 160, tooltip: true},
        {key: 'contentIssue', title: '问题描述', align: 'center', minWidth: 200, tooltip: true},
        {key: 'problemCategoryName', title: '问题类别', align: 'center', minWidth: 150},
        {key: 'rectifyPlan', title: '整改方案', align: 'center', minWidth: 200, tooltip: true},
        {key: 'completion', title: '当前进展描述', align: 'center', minWidth: 200, tooltip: true},
        {key: 'checkTime', title: '检查时间', align: 'center', minWidth: 150, render: this.renderCellDate},
        {
          key: 'completeTime',
          title: '完成时限',
          align: 'center',
          minWidth: 150,
          render: this.renderCellDate
        }
      ],
      columns1: [
        {
          type: 'expand', width: 30,
          fixed: 'left',
          _disableExpand: true,
          render: (h, params) => {
            return h('Table', {
              props: {
                columns: [
                  {key: 'checkContent', title: '检查内容', align: 'center', width: 160, tooltip: true},
                  {key: 'contentIssue', title: '问题描述', align: 'center', minWidth: 200, tooltip: true},
                  {key: 'problemCategoryName', title: '问题类别', align: 'center', minWidth: 150},
                  {key: 'rectifyPlan', title: '整改方案', align: 'center', minWidth: 200, tooltip: true},
                  {key: 'completion', title: '当前进展描述', align: 'center', minWidth: 200, tooltip: true},
                  {key: 'checkTime', title: '检查时间', align: 'center', minWidth: 150, render: this.renderCellDate},
                  {
                    key: 'completeTime',
                    title: '完成时限',
                    align: 'center',
                    minWidth: 150,
                    render: this.renderCellDate
                  }, {
                    key: 'finishTime',
                    title: '完成时间',
                    align: 'center',
                    minWidth: 150,
                    render: this.renderCellDate
                  },
                ],//表头
                data: params.row.items,//内部表格展示的数据
              },
            })//我这里使用的是表格，大家也可以根据自己的实际情况更换别的组件
          }
        },
        {title: '序号', key: "index", width: 80, fixed: 'left', align: 'center', render: this.indexColumnsRenderSum},
        // { key:'perfAssessNum',title: '绩效考核责任书编号',  align: 'center', width: 100},
        {key: 'companyName', title: '被检查企业', align: 'center', minWidth: 200},
        {key: 'checkTheme', title: '检查主题', align: 'center', minWidth: 160, tooltip: true},
        {key: 'inspectionTime', title: '检查时间', align: 'center', minWidth: 150,sortable: "custom", render: this.renderCellDate},
        // { key:'inspectionGroupCategory',title: '检查组别',  align: 'center', width: 120,render:(h, params)=>{
        //   return h('span', this.igcMap && this.igcMap[params.row.inspectionGroupCategory] && this.igcMap[params.row.inspectionGroupCategory].codingName)}, },
        {key: 'rummager', title: '检查组人员', align: 'center', minWidth: 200},
        {key: 'contentIssueCount', title: '问题数量', align: 'center', minWidth: 100},
        {key: 'issueCompletionCount', title: '整改完成问题数量', align: 'center', minWidth: 150},
        // { key:'contentIssue',title: '检查内容及发现问题',  align: 'center', width: 200 , tooltip:true },
        // { key:'issueRectificationRequest',title: '问题及整改要求',  align: 'center', width: 200, tooltip:true  },
        // { key:'issueCompletion',title: '问题整改完成情况',  align: 'center', width: 200, tooltip:true  },
        // { key:'issueCompletionTime',title: '整改完成时间',  align: 'center', width: 150, render: this.renderCellDate  },
        {key: 'checkLocation', title: '检查位置', align: 'center', minWidth: 150, tooltip: true},
        {key: 'createDate', title: '填表时间',sortable: "custom", align: 'left', minWidth: 120, render: this.renderCellDate},
        this.getActionColumns((params) => {
          return params.index === 0;
        }),
      ],
      ruleCustom: {
        companyId: [{required: true, message: '请填写企业名称', trigger: 'input'}],
        inspectionTime: [{required: true, message: '请填写检查时间', trigger: 'change', type: 'date'}],
        inspectionGroupCategory: [{required: true, message: '请填写检查组别', trigger: 'change'}],
        rummager: [{pattern: /^([^0-9])*$/, required: true, message: '请填写检查组人员', trigger: 'change'}],
        // rptType:[{required: true, message: '请选择检查类型', trigger: 'change',type: 'number'}]
      },
      modal4: false,
      item: {},
      dataTableFail: [],
      itemModel: false,
      itemAdd: false,
      extensionShow: {
        userId: [{required: true, message: '请选择审批人', trigger: 'change'}],
        explain: [{required: true, message: '请填写延期申请', trigger: 'change'}],
        completeTime: [{
          validator: (rule, value, callback) => {
            if (value == null || value == '' || value == undefined) {
              callback(' ')
            } else {
              callback()
            }
          },
          required: true,
          trigger: 'change'
        }],
      },
      columns2: [

        {
          title: '序号', width: 70, fixed: 'left', align: 'center', render: (h, params) => {
            return h('span', params.index + 1)
          }
        },
        {key: 'checkContent', title: '检查内容', align: 'center', width: 160, tooltip: true},
        {key: 'problemCategoryName', title: '问题类别', align: 'center', width: 160, tooltip: true},
        {key: 'contentIssue', title: '问题描述', align: 'center', width: 160, tooltip: true},
        {key: 'issueRectificationRequest', title: '整改方案', align: 'center', width: 160, tooltip: true},
        {key: 'issueCompletion', title: '当前进展描述', align: 'center', width: 160, tooltip: true},
        {key: 'checkTime', title: '检查时间', align: 'center', width: 120, render: this.renderCellDate},
        {key: 'issueCompletionTime', title: '完成时限', align: 'center', width: 120, render: this.renderCellDate},
        {
          key: 'finishTime',
          title: '完成时间',
          align: 'center',
          minWidth: 150,
          render: this.renderCellDate
        },
        {
          title: '操作',
          key: 'action',
          fixed: 'right',
          width: 230,
          align: 'center',
          render: (h, params) => {
            if (this.$route.query.id == '1') {
              if (params.row.state == 'OPEN') {
                return h('div', [
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px', color: '#c5c8ce'}
                  }, '问题延期'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px',},
                    on: {
                      click: () => {
                        this.item = {...params.row}
                        this.getFilesItem('id', 'EnQuestionDetailForApproval');
                        this.modal3 = true
                      }
                    }
                  }, '详情'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px', color: '#c5c8ce'}
                  }, '修改'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px', color: '#c5c8ce'}
                  }, '删除')
                ]);
              } else {
                if (!params.row.exist) {
                  return h('div', [
                    h('A', {
                      props: {type: 'primary', size: 'small'},
                      style: {fontSize: '14px', color: '#c5c8ce'}
                    }, '问题延期'),
                    h('Divider', {props: {type: 'vertical'}}, ''),
                    h('A', {
                      props: {type: 'primary', size: 'small'},
                      style: {fontSize: '13px',},
                      on: {
                        click: () => {
                          this.item = {...params.row}
                          this.getFilesItem('id', 'EnQuestionDetailForApproval');
                          this.modal3 = true
                        }
                      }
                    }, '详情'),
                    h('Divider', {props: {type: 'vertical'}}, ''),
                    h('A', {
                      props: {type: 'primary', size: 'small'},
                      style: {fontSize: '13px',},
                      on: {
                        click: () => {
                          this.item = {...params.row}
                          this.item.accountType = '2';
                          if (!this.item.id) {
                            this.item.id = this.get_uuid();
                          }
                          if (!this.item.issueCompletionTime) {
                            this.item.exist = '0';
                          }
                          this.getFilesItem('id', 'EnQuestionDetailForApproval');
                          this.itemModel = true
                          this.itemAdd = false
                        }
                      }
                    }, '修改'),
                    h('Divider', {props: {type: 'vertical'}}, ''),
                    h('A', {
                      props: {type: 'primary', size: 'small'},
                      style: {fontSize: '13px', color: 'red'},
                      on: {
                        click: () => {
                          this.$Modal.confirm({
                            title: '提示',
                            content: '<p>是否确定删除？</p>',
                            onOk: () => {
                              this.dataToView.items.splice(params.index, 1)
                              this.dataToView.contentIssueCount = this.dataToView.items.length;
                            }
                          })
                        }
                      }
                    }, '删除'),
                  ])
                } else {
                  //修改 判断是否存在其它延期申请
                  if (params.row.procinstState == '1' || params.row.procinstState == '2') {
                    return h('div', [
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '14px', color: '#c5c8ce'}
                      }, '问题延期'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '13px',},
                        on: {
                          click: () => {
                            this.item = {...params.row}
                            this.getFilesItem('id', 'EnQuestionDetailForApproval');
                            this.modal3 = true
                          }
                        }
                      }, '详情'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '13px',},
                        on: {
                          click: () => {
                            this.item = {...params.row}
                            if (!this.item.id) {
                              this.item.id = this.get_uuid();
                            }
                            if (!this.item.issueCompletionTime) {
                              this.item.exist = '0';
                            }
                            this.getFilesItem('id', 'EnQuestionDetailForApproval');
                            this.itemModel = true
                            this.itemAdd = false
                          }
                        }
                      }, '修改'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '14px', color: '#c5c8ce'}
                      }, '删除'),
                    ])
                  } else {
                    return h('div', [
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '14px',},
                        on: {
                          click: () => {
                            let dataToExtension = _deepclone(params.row);
                            this.dataToExtension = {
                              completeTime: dataToExtension.completeTime,
                              questionId: dataToExtension.id,
                            };
                            this.modal4 = true;
                          }
                        }
                      }, '问题延期'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '13px',},
                        on: {
                          click: () => {
                            this.item = {...params.row}
                            this.getFilesItem('id', 'EnQuestionDetailForApproval');
                            this.modal3 = true
                          }
                        }
                      }, '详情'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '13px',},
                        on: {
                          click: () => {
                            this.item = {...params.row}
                            if (!this.item.id) {
                              this.item.id = this.get_uuid();
                            }
                            if (!this.item.issueCompletionTime) {
                              this.item.exist = '0';
                            }
                            this.getFilesItem('id', 'EnQuestionDetailForApproval');
                            this.itemModel = true
                            this.itemAdd = false
                          }
                        }
                      }, '修改'),
                      h('Divider', {props: {type: 'vertical'}}, ''),
                      h('A', {
                        props: {type: 'primary', size: 'small'},
                        style: {fontSize: '13px', color: 'red'},
                        on: {
                          click: () => {
                            this.$Modal.confirm({
                              title: '提示',
                              content: '<p>是否确定删除？</p>',
                              onOk: () => {
                                this.dataToView.items.splice(params.index, 1)
                                this.dataToView.contentIssueCount = this.dataToView.items.length;
                              }
                            })
                          }
                        }
                      }, '删除'),
                    ])
                  }
                }

              }
            } else {
              if (params.row.state == 'OPEN') {
                return h('div', [
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px',},
                    on: {
                      click: () => {
                        this.item = {...params.row}
                        this.getFilesItem('id', 'EnQuestionDetailForApproval');
                        this.modal3 = true
                      }
                    }
                  }, '详情'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px', color: '#c5c8ce'}
                  }, '修改'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '14px', color: '#c5c8ce'}
                  }, '删除')
                ]);
              } else {
                return h('div', [
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '13px',},
                    on: {
                      click: () => {
                        this.item = {...params.row}
                        this.getFilesItem('id', 'EnQuestionDetailForApproval');
                        this.modal3 = true
                      }
                    }
                  }, '详情'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '13px',},
                    on: {
                      click: () => {
                        this.item = {...params.row}
                        this.item.accountType = '2';
                        if (!this.item.id) {
                          this.item.id = this.get_uuid();
                        }
                        if (!this.item.issueCompletionTime) {
                          this.item.exist = '0';
                        }
                        this.getFilesItem('id', 'EnQuestionDetailForApproval');
                        this.itemModel = true
                        this.itemAdd = false
                      }
                    }
                  }, '修改'),
                  h('Divider', {props: {type: 'vertical'}}, ''),
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '13px', color: 'red'},
                    on: {
                      click: () => {
                        this.$Modal.confirm({
                          title: '提示',
                          content: '<p>是否确定删除？</p>',
                          onOk: () => {
                            this.dataToView.items.splice(params.index, 1)
                            this.dataToView.contentIssueCount = this.dataToView.items.length;
                          }
                        })
                      }
                    }
                  }, '删除'),
                ])
              }
            }

          }
        }
      ],
      twoLevel: [],
      dataToExtension: {},
      itemRuleCustom: {
        checkContent: [{required: true, message: '请填写检查内容', trigger: 'change'}],
        contentIssue: [{required: true, message: '请填写发现问题', trigger: 'change'}],
        problemCategory: [{required: true, message: '请选择问题类别', trigger: 'change'}],
        checkTime: [{
          validator: (rule, value, callback) => {
            if (!value) {
              callback(' ');
            } else {
              callback()
            }
          },
          required: true,
          trigger: 'change'
        }],
        issueCompletionTime: [{
          validator: (rule, value, callback) => {
            if (!value) {
              callback(' ');
            } else {
              callback()
            }
          },
          required: true,
          trigger: 'change'
        }],
        issueRectificationRequest: [{required: true, message: '请填写整改要求', trigger: 'change'}],
      },
      uploadItemUrl: Api.uploadModSaSuperviseInspect + this.$route.query.id,
      tableHeight: 10,
      igcMap: {},
      approvers: [],
      // rptTypeList: [{value: 1,label: '环保监督检查'},{value: 2,label: '安全监督检查'}],
      // api
      queryUrl: Api.querySaSuperviseInspect,
      exportUrl: Api.exportSaSuperviseInspect,
      deleteUrl: Api.deleteSaSuperviseInspect,
      bthDeleteUrl: Api.batchDeleteSaSuperviseInspect,
      getUrl: Api.getSaSuperviseInspect,
      updateUrl: Api.updateSaSuperviseInspect,
      saveUrl: Api.saveSaSuperviseInspect,
    }
  },
  computed: {
    itemColumn() {
      const columns = [...this.columns2];
      const columns1 = []
      columns.forEach(item => {
        if (this.mode !== 'view') {
          columns1.push(item)
        } else {
          if (item.key !== 'action') {
            columns1.push(item)
          } else {
            columns1.push({
              title: '操作',
              key: 'action',
              fixed: 'right',
              width: 110,
              align: 'center',
              render: (h, params) => {
                return h('div', [
                  h('A', {
                    props: {type: 'primary', size: 'small'},
                    style: {fontSize: '13px',},
                    on: {
                      click: () => {
                        this.item = {...params.row}
                        this.getFilesItem('id', 'EnQuestionDetailForApproval');
                        this.modal3 = true
                      }
                    }
                  }, '详情'),
                ])
              }
            })
          }
        }
      })
      return columns1
    },
  },
  async mounted() {
    await this.$http.get(Api.queryCodeDetailBySortId + '/IGC-000003', {params: {}}).then((res) => {
      this.igcMap = this.dictListToMap(res.data.data);
    });
    await this.$http.get(Api.queryCodeDetailBySortId + '/NOT-00006', {params: {}}).then((res) => {
      this.environmentProtectionList = res.data.data;
    });
    this.$http.get(Api.queryCodeDetailBySuperiorcode + '/NOT-00007000000001', {params: {}}).then((res) => {
      this.basicList = res.data.data;
    });
    this.$http.get(Api.queryCodeDetailBySuperiorcode + '/NOT-00007000000004', {params: {}}).then((res) => {
      this.sceneList = res.data.data;
    });
    this.$http.get(Api.getEnProQuestionAccountApprovers + "/b93eb368d0994a768c0eb84ed5fa794c").then((res) => {
      this.approvers = res.data.data;
    });
    this.$http.get(Api.quqeryTwoOrgInfo).then(res => {
      this.twoLevel = res.data.data
    })
    this.setSumTableHeight();
    this.dataToQuery.rptType = this.$route.query.id
    if (this.$route.query.prId) {
      this.dataToQuery.id = this.$route.query.prId
    } else {
      let date = this.setInspectionTimeRange();
      this.onSelectFieldQueryDateRange(date, 'inspectionTime');
    }
    this.query();
  },
  methods: {
    ...pageCommonFunction,
		sortChange(data) {
		    if (data.order === 'asc'||data.order ==='desc') {
		        let order = data.key
		        this.dataToQuery.order = order +' '+ data.order
		        this.query()
		    }
		},
    setInspectionTimeRange() {
      let date1 = new Date();
      let year1 = date1.getFullYear();
      let firstMonth = year1 + '-' + '01' + '-' + '01';
      let firstDate = new Date(Date.parse(firstMonth))
      this.$set(this.dataToQuery.inspectionTimeRange, 0, firstDate);
      let date = new Date();
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      let day = date.getDate();
      if (month < 10) {
        month = "0" + month;
      }
      if (day < 10) {
        day = "0" + day;
      }
      ;
      let currentdate = year + '-' + month + '-' + day;
      let currentDate = new Date(Date.parse(currentdate))
      this.$set(this.dataToQuery.inspectionTimeRange, 1, currentDate);
      return [firstMonth, currentdate]

    },
    downloadMod() {
      let url = Api.DownloadModSaSuperviseInspect + this.dataToQuery.rptType
      this.$http.get(url, {
        responseType: 'blob'      //告诉服务器我们需要的响应格式
      }).then((res) => {
        const aLink = document.createElement("a");
        let blob = new Blob([res.data], {
          type: res.bodyBlob.type      //将会被放入到blob中的数组内容的MIME类型
        });
        aLink.href = URL.createObjectURL(blob)
        aLink.download = "公司内部监督检查导入模版.xlsx" //标题
        aLink.click()
        document.body.appendChild(aLink)
      })
    },
    uploadItem(response) {
      if (response.status == '200') {
        response.data.forEach(item => {
          item.id = this.get_uuid();
          this.dataToView.items.push(item);
        })
      } else {
        this.dataTableFail = [];
        this.dataTableFail = response.data;
        this.modelFail = true;
      }
      this.$set(this.dataToView, 'contentIssueCount', this.dataToView.items.length)
    },
    getSelectModelData(row) {
      this.dataToExtension.userId = row.userId;
      this.dataToExtension.userName = row.userName;
      this.modal5 = false;
    },
    cancel() {
      this.modal4 = false;
    },
    queryItems() {
      this.loadingItems = true;
      this.$http.get(Api.querySaSuperviseInspectItem + this.dataToView.id).then((res) => {
        if (res.data.status == '200') {
          this.loadingItems = false;
          this.dataToView.items = res.data.data;
        } else {
          this.$Message.error(res.data.msg);
        }
        this.loadingItems = false;

      }).catch(e => {
        this.$Message.error(res.data.msg);
        console.log(e);
      })
    },
    submitExtension(name) {
      let _this = this;
      this.$refs[name].validate((valid) => {
        if (valid) {
          _this.loadingExtension = true;
          let url = Api.extensionEnProQuestionAccount;
          this.$http.post(url, _this.dataToExtension).then((res) => {
            if (res.data.status == '200') {
              _this.$Message.success("上报成功")
              _this.queryItems();
              _this.modal4 = false;
            } else {
              this.$Message.error(res.data.msg);
            }
            _this.loadingExtension = false;
          }).catch(e => {
            console.log(e)
          })
        } else {
          this.$Message.error('请填报完整!');
        }
      })
    },
    getUser() {
      this.modal5 = true;
    },
    addItem() {
      this.itemModel = true;
      this.itemAdd = true;
      this.item = {
        id: this.get_uuid(),
        checkTime: this.dataToView.inspectionTime,
        state: 'NOT_RECTIFIED',
        accountType: '2'

      }
    },
    renderState(state) {
      switch (state) {
        case "START":
          return '整改中';
        case "NOT_RECTIFIED":
          return '待整改';
        case "OPEN":
          return '已完成';
        case "DELAY":
          return '延期';
      }

    },
    inputRectifyPlan(value) {
      if (value && this.item.state == 'NOT_RECTIFIED') {
        this.item.state = 'START'
      } else if ((!value) && this.item.state == 'START') {
        this.item.state = 'NOT_RECTIFIED'
      }
    },
    onState(data) {
      switch (data) {
        case "NOT_RECTIFIED":
          this.item.state = 'NOT_RECTIFIED';
          this.item.finishTime = null;
          break;
        case "START":
          this.item.state = 'START';
          this.item.finishTime = null;
          break;
        case "OPEN":
          this.item.state = 'OPEN';
          this.item.finishTime = new Date();
          break;
      }
    },
    selectChange(data) {
      this.item.problemCategory = data.value
      this.item.problemCategoryName = data.label
    },
    beforeUploadItem(file, filedName, type) {
      let formData = new FormData();
      formData.append("files", file); // 文件对象
      let url = this.fileUrl + '/' + this.item[filedName] + '/files/' + type
      this.$http.post(url, formData).then((res) => {
        if (res.data.result == "success") {
          this.$Message.info("文件上传成功")
          this.getFilesItem(filedName, type);
        }
      })
      return false
    },
    async getFilesItem(filedName, type) {
      if (this.item[filedName]) {
        let url = this.fileUrl + '/' + this.item[filedName] + '/files/' + type.split('/')[0]
        await this.$http.get(url).then((res) => {
          if (res.data.result == "success") {
            this.$set(this.item, filedName + 'Files', res.data.data)
            let index = 0;
            res.data.data.forEach(item => {
              this.uploadListPercent[index] = 0;
              this.uploadListVisible[index] = false;
              this.uploadListVisible[item.id] = false;
              index++;
            })
            console.log(this.item)
          }
        });
      }

    },
    removeItemFile(id, filedName, type) {
      let url = this.fileUrl + '/file/' + id;
      this.$http.delete(url).then((res) => {
        this.getFilesItem(filedName, type)
      })
    },
    itemSubmit(name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          this.$Modal.confirm({
            title: '提示',
            content: '<p>问题状态为“已完成”时不可继续修改删除，是否继续保存</p>',
            onOk: () => {
              let _this = this
              _this.dataToView.items.splice()
              if (_this.itemAdd) {
                _this.dataToView.items.push(_this.item)
                _this.dataToView.contentIssueCount = _this.dataToView.items.length;
                if (_this.item.state == 'OPEN') {
                  _this.dataToView.issueCompletionCount += 1;
                }
              } else {
                if (_this.item.state == 'OPEN') {
                  _this.dataToView.issueCompletionCount += 1;
                }
                _this.dataToView.items[_this.item._index] = _this.item
                _this.dataToView.contentIssueCount = _this.dataToView.items.length;
              }
              _this.itemModel = false
            },
            onCancel: () => {
            }
          })
        } else {
          this.$Message.error('请填报完整!');
        }
      })
    },
    createEmptyDataToAdd() {
      return {
        fileId: this.get_uuid(),
        issueCompletionCount: 0,
        contentIssueCount: 0,
        fileIdFiles: [],
        items: []
      }
    },
    dictListToMap(arr, key = 'codingCodeId') {
      let map = {}
      arr.map(item => {
        map[item[key]] = item
      })
      return map
    },
    deleteData(params) {
      this.deleteDateAjax(params);
    },
    query() {
      this.dataToQuery.rptType = this.$route.query.id
      this.queryAjax();
    },
    submit(name) {
      let _this = this;
      this.dataToView.rptType = this.dataToQuery.rptType
      if (this.dataToView.issueCompletionCount == '') this.dataToView.issueCompletionCount = 0;
      if (this.dataToView.contentIssueCount == '') this.dataToView.contentIssueCount = 0;
      this.dataToView.items.forEach(item => {
        if (_this.$route.query.id == '1') {
          item.accountType = '2'
        } else {
          item.accountType = '1'
        }

      })
      console.log(this.dataToView);
      this.submitAjax(name);

    },
    switchQuery(flag) {
      this.switchFlag = flag;
      if (!this.switchFlag) {
        this.tableHeight = this.tableHeight + 88;
      } else {
        this.tableHeight = this.tableHeight - 88;
      }
    },
    async afterDataToViewInit() {
      await this.getFiles('fileId');
    },
    handleSummary({ columns, data }){
      let temp = JSON.parse(JSON.stringify(data));
      temp.splice(0, 1);
      const sums = {};
      columns.forEach((column, index) => {
        const key = column.key;
        if (index === 1) {
          sums[key] = {
            key,
            value: '合计'
          };
          return;
        }
        const values = temp.map(item => Number(item[key]));
        if (!values.every(value => isNaN(value))) {
          const v = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[key] = {
            key,
            value: v
          };
        } else {
          sums[key] = {
            key,
            value: ''
          };
        }
      })
      return sums;
    }
  },
  watch: {},

}
</script>

<style lang='css' scoped>
.rpt-form {
}

/deep/ .rpt-form .query-form-el {
  width: 100%;
}


.importDanger {
  display: inline-block
}
</style>
